<HTML>
<HEAD>
<TITLE>JavaScript Source Code 3000:  Clocks:  Current Time</TITLE>
<META HTTP-EQUIV="JavaScript Source Code 3000" CONTENT = "no-cache">
<META NAME="date" CONTENT="2000-09-09">
<META NAME="channel" CONTENT="Web Developer">
<META NAME="author" CONTENT="JavaScript Source Code 3000">
<META NAME="section" CONTENT="Clocks">
<META NAME="description" CONTENT="Use JavaScript to put the current time on your page.  It even follows the time in A.M. and P.M.!  A nice script.">

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var timerID = null;
var timerRunning = false;
function stopclock (){
if(timerRunning)
clearTimeout(timerID);
timerRunning = false;
}
function showtime () {
var now = new Date();
var hours = now.getHours();
var minutes = now.getMinutes();
var seconds = now.getSeconds()
var timeValue = "" + ((hours >12) ? hours -12 :hours)
if (timeValue == "0") timeValue = 12;
timeValue += ((minutes < 10) ? ":0" : ":") + minutes
timeValue += ((seconds < 10) ? ":0" : ":") + seconds
timeValue += (hours >= 12) ? " P.M." : " A.M."
document.clock.face.value = timeValue;
timerID = setTimeout("showtime()",1000);
timerRunning = true;
}
function startclock() {
stopclock();
showtime();
}
// End -->
</SCRIPT>
</HEAD>

<BODY BGCOLOR=#ffffff vlink=#0000ff onLoad="startclock()";>

<BR>
<center>
<table width="600" cellpadding="0" cellspacing="10">
<tr>
<td width="468" align="center">

	
</td>
<td width="120" align="center">

	
</td>
</tr>
</table>
<BR>
<BR>
<BASEFONT SIZE=3>
  <FONT SIZE=6>
<B><FONT SIZE="+2" FACE="Helvetica,Arial" ALIGN=RIGHT COLOR="#0000FF">
<b><A HREF="../index.htm" /" TARGET="_top">
Home</A> </b><img src="../img/arrow.gif" /img/arrow.gif" height=13 width=7 border=0 alt="}"> <b><A HREF="index.htm" /clocks/"><font color="#FF0000">Clocks</font></A> </b>
<img src="../img/arrow.gif" /img/arrow.gif" height=13 width=7 border=0 alt="}"> <FONT COLOR="#006666">Current Time</FONT></b></FONT><BR>
</B><BR>
  </FONT>
<table BORDER=0 WIDTH=486 CELLPADDING=3 CELLSPACING=0>
<tr><td><font FACE="helvetica,arial,geneva">
<br>
<br>
<!-- Description --><!--content_start-->

Use JavaScript to put the current time on your page.  It even follows the time in A.M. and P.M.!  A nice script.
<br>
<hr>
</td></tr>
</table>
<!-- Demonstration -->
<BODY>
<CENTER>
<FORM name="clock"><input type="text" name="face" size=13 value=""></FORM>
</CENTER>
<P>
<P>
<a name="source">
<table BORDER=0 WIDTH=486 CELLPADDING=3 CELLSPACING=0>
<tr><td BGCOLOR=yellow><font FACE="helvetica,arial,geneva"><b>JavaScript Source Code 3000:  Clocks:  Current Time</b>
<p>Simply click inside the window below, use your cursor to highlight the script, and copy (type Control-c or Apple-c) the script into a new file in your text editor (such as Note Pad or Simple Text) and save (Control-s or Apple-s).  The script is yours!!!<br><br></font></td></tr>
<tr><td BGCOLOR=yellow ALIGN=CENTER>
<form NAME="copy">

<DIV align="center">
<input type=button value="Highlight All" onClick="javascript:this.form.txt.focus();this.form.txt.select();">&nbsp;&nbsp;&nbsp;&nbsp;
<INPUT TYPE="text" NAME="total" VALUE="Script Size:  1.45 KB  " size="24">
</DIV>

<textarea NAME="txt" ROWS=20 COLS=75 WRAP=VIRTUAL>

&lt;!-- THREE STEPS TO INSTALL CURRENT TIME:

   1.  Paste the specified coding into the HEAD of your HTML document
   2.  Add the onLoad event handler to the BODY tag 
   2.  Put the last code into the BODY of your HTML document  --&gt;

&lt;!-- STEP ONE: Copy this code into the HEAD of your HTML document  --&gt;
		  
&lt;HEAD&gt;

&lt;SCRIPT LANGUAGE="JavaScript"&gt;

&lt;! &gt;
&lt;! &gt;

&lt;!-- Begin
var timerID = null;
var timerRunning = false;
function stopclock (){
if(timerRunning)
clearTimeout(timerID);
timerRunning = false;
}
function showtime () {
var now = new Date();
var hours = now.getHours();
var minutes = now.getMinutes();
var seconds = now.getSeconds()
var timeValue = "" + ((hours &gt;12) ? hours -12 :hours)
if (timeValue == "0") timeValue = 12;
timeValue += ((minutes &lt; 10) ? ":0" : ":") + minutes
timeValue += ((seconds &lt; 10) ? ":0" : ":") + seconds
timeValue += (hours &gt;= 12) ? " P.M." : " A.M."
document.clock.face.value = timeValue;
timerID = setTimeout("showtime()",1000);
timerRunning = true;
}
function startclock() {
stopclock();
showtime();
}
// End --&gt;
&lt;/SCRIPT&gt;

&lt;!-- STEP TWO: Add this onLoad event handler to the BODY tag  --&gt;

&lt;BODY onLoad="startclock()"&gt;

&lt;!-- STEP THREE: Copy this code into the BODY of your HTML document  --&gt;

&lt;CENTER&gt;
&lt;FORM name="clock"&gt;
&lt;input type="text" name="face" size=13 value=""&gt;
&lt;/FORM&gt;
&lt;/CENTER&gt;

 

&lt;!-- Script Size:  1.45 KB  --&gt;
</textarea><br><font FACE="helvetica,arial,geneva"></font></td></tr>

</table>
</form>
</FONT>
</CENTER>


</center>
</body></html>